<template>
  <div class="index">
      <el-row>
        <el-col class="index-head" :span="24">
            <div class="index-head-left">工资设置</div>
        </el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :lg="18" :xl="20" style="padding-left:0">
            <div class="gongzishezhi-left"> 
              <el-form ref="form" :model="form" label-width="180px">
                <el-col :span="8" :offset="2">
                    <el-form-item label="普通员工基本工资：">
                        <el-input v-model="form.employeeBasicWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目一教学学时单价：">
                        <el-input v-model="form.lentimeOneWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="普通员工工龄工资：">
                        <el-input v-model="form.employeeSeniorityWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目二教学学时单价：">
                        <el-input v-model="form.lentimeTwoWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="教练员基本工资：">
                        <el-input v-model="form.teacherBasicWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目三教学学时单价：">
                        <el-input v-model="form.lentimeThreeWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="教练员工龄工资：">
                        <el-input v-model="form.teacherSeniorityWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目四教学学时单价：">
                        <el-input v-model="form.lentimeFourWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="请假单价：">
                        <el-input v-model="form.vacatePrice" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目二加时学时单价：">
                        <el-input v-model="form.lentimeTwoJsWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="迟到单价：">
                        <el-input v-model="form.latePrice" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目二模拟学时单价：">
                        <el-input v-model="form.lentimeTwoMnWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="休班单价：">
                        <el-input v-model="form.ofdutyPrice" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目三加时学时单价：">
                        <el-input v-model="form.lentimeThreeJsWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="早退单价：">
                        <el-input v-model="form.earlyPrice" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8" :offset="2">
                    <el-form-item label="科目三模拟学时单价：">
                        <el-input v-model="form.lentimeThreeMnWages" placeholder="100"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-button round class="save-btn" @click="submit">保    存</el-button>
                </el-col>
              </el-form>
            </div>
        </el-col>
        <el-col :lg="6" :xl="4" class="gongzishezhi-right">
            <p class="student-select-title" style="margin-bottom: 22px;">数据同步设置</p>
            <div class="switch-cont">
                <ul>
                    <li><span class="myswitch-text">报名费</span><el-switch class="myswitch-btn" v-model="syncContent[0]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">加时费</span><el-switch class="myswitch-btn" v-model="syncContent[1]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">考试模拟费</span><el-switch class="myswitch-btn" v-model="syncContent[2]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">包库管理费</span><el-switch class="myswitch-btn" v-model="syncContent[3]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">车辆加油加气</span><el-switch class="myswitch-btn" v-model="syncContent[4]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">车辆维修保养</span><el-switch class="myswitch-btn" v-model="syncContent[5]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">工资发放</span><el-switch class="myswitch-btn" v-model="syncContent[6]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">费用报销</span><el-switch class="myswitch-btn" v-model="syncContent[7]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                    <li><span class="myswitch-text">车辆保险</span><el-switch class="myswitch-btn" v-model="syncContent[8]" active-color="#ff3528" inactive-color="#cecece"></el-switch></li>
                </ul>
            </div>
        </el-col>
      </el-row>
  </div>
</template>

<script>
export default {
  name: "gongzhishezhi",
  mounted: function() {
    this.$http.get("iem/configInfo", d => {
      if (d.status == 1) {
        this.form = d.data.config;
        let _swicth = d.data.config.syncContent.split(",");
        _swicth.forEach(e => {
            this.syncContent[e-1] = true;
        });
      }
    });
  },
  data() {
    return {
      form: {},
      syncContent: [false,false,false,false,false,false,false,false,false]
    };
  },
  methods:{
      submit(){
          let _syncContent = [];
          this.syncContent.forEach((e,i)=>{
              if(e == true) {
                  _syncContent.push(i+1);
              }
          });
          this.form.syncContent = _syncContent.join();
        //   console.info(JSON.parse(JSON.stringify(this.form)));
        this.$http.post("/iem/config",this.form, d=>{
            if(d.status == 1){
                layer.msg("操作成功")
            }else {
                layer.msg(d.msg, {
                    shift: 6,
                    shade: 0.3
                });
            }
        })
      }
  }
};
</script>

<style scoped>
.switch-cont ul li {
  width: 100%;
  padding: 26px 0;
  float: left;
}
.myswitch-text {
  display: block;
  float: left;
  color: #606060;
}
.myswitch-btn {
  float: right;
  top: 0;
  left: 0;
}
.save-btn {
  background: url("../../static/img/nav-bg.png");
  background-size: 100% 100%;
  color: #fff;
  border: 0;
  padding: 18px 54px;
  margin: 30px auto;
  display: block;
}
.gongzishezhi-left .el-form-item {
  margin-bottom: 32px !important;
}
.gongzishezhi-left {
  background: #fff;
  padding: 30px 0;
  border: 1px solid #e1e1e1;
  border-radius: 5px;
  margin-top: 20px;
  float: left;
}
.gongzishezhi-right {
  background: #fff;
  padding: 30px 0;
  border: 1px solid #e1e1e1;
  border-radius: 5px;
  margin-top: 20px;
  float: left;
}
</style>


